<template>
	<div style="height:100%;">
		<div class="penalrow selectw100">
			<div class="inlineblock verticalmiddle infoitem" style="width:32%;">
				<div class="inlineblock verticalmiddle">
					能力参数
				</div>
				<div class="inlineblock verticalmiddle informationItem">
					<el-select v-model="demand.detectability" placeholder="请选择" size="mini" clearable @change="init">
						<el-option v-for="item in detectabilityData" :key="item.id" :label="item.name" :value="item.id">
						</el-option>
					</el-select>
				</div>
			</div>
			<div class="inlineblock verticalmiddle infoitem" style="width:32%;">
				<div class="inlineblock verticalmiddle">
					开始日期
				</div>
				<div class="inlineblock verticalmiddle informationItem">
					<el-date-picker size="mini" :editable="datapickereditable" v-model="demand.startDate" type="date" placeholder="选择起始日期" format="yyyy 年 MM 月 dd 日"
					 value-format="yyyy-MM-dd" style="width:100%;" @change="init">
					</el-date-picker>
				</div>
			</div>
			<div class="inlineblock verticalmiddle infoitem" style="width:32%;">
				<div class="inlineblock verticalmiddle">
					结束日期
				</div>
				<div class="inlineblock verticalmiddle informationItem">
					<el-date-picker size="mini" :editable="datapickereditable" :picker-options="pickerenddatefanwei" v-model="demand.endDate"
					 type="date" placeholder="选择结束日期" format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd" style="width:100%;" @change="init">
					</el-date-picker>
				</div>
			</div>
			<el-button type="warning" size="mini" @click="init">搜索</el-button>
			<el-button type="warning" size="mini" @click="empty">清空</el-button>
		</div>
		<!-- <div class="penalrow selectw100"> -->
			<!--<div class="inlineblock verticalmiddle infoitem" style="width:33%;">
				<div class="inlineblock verticalmiddle">
					曲线状态
				</div>
				<div class="inlineblock verticalmiddle informationItem">
					<el-select v-model="demand.status" placeholder="请选择" size="mini" clearable @change="init">
						<el-option v-for="item in enableStatus" :key="item.value" :label="item.label" :value="item.value">
						</el-option>
					</el-select>
				</div>
			</div>-->


		<!-- </div> -->
		<div class="separaterow" style="height:calc(100% - 106px)">
			<el-table :data="StandardCuRecordList" style="width: 100%;height:100%;" class="tableCon" size="mini">
				<el-table-column label="序号" min-width="50px">
					<template slot-scope="scope">
						{{scope.$index+1}}
					</template>
				</el-table-column>
				<el-table-column property="name" label="名称" min-width="120px" show-overflow-tooltip>
				</el-table-column>
				<el-table-column property="batchCode" label="检测单号" min-width="120px" show-overflow-tooltip>
				</el-table-column>
				<el-table-column property="detectabilityName" label="能力参数名称" min-width="120px" show-overflow-tooltip>
				</el-table-column>
        <el-table-column property="configManName" label="配置人" min-width="80px">
          <template slot-scope="scope">
          	{{scope.row.hasOwnProperty('configManName')?scope.row.configManName:'---'}}

          </template>
        </el-table-column>
        <el-table-column property="doUse" label="是否应用" min-width="80px">
        	<template slot-scope="scope">
        		<p v-if="scope.row.doUse">是</p>
        		<p v-else>否</p>
        	</template>
        </el-table-column>
        <el-table-column property="doDefaultUse" label="是否默认" min-width="80px">
        	<template slot-scope="scope">
        		<p v-if="scope.row.doDefaultUse" style="color: red;">是</p>
        		<p v-else>否</p>
        	</template>
        </el-table-column>
				<el-table-column property="createTime" label="创建日期" min-width="140px" show-overflow-tooltip>
					<template slot-scope="scope">
						{{scope.row.hasOwnProperty('createTime')?scope.row.createTime.split('.')[0]:'---'}}

					</template>
				</el-table-column>
				<!-- <el-table-column property="slope" label="斜率" min-width="90px">
				</el-table-column>
				<el-table-column property="deviation" label="偏移" min-width="90px">
				</el-table-column> -->


        <el-table-column property="status" label="状态" min-width="90px" :formatter = "formatterStatus">

        </el-table-column>

				<el-table-column label="操作" min-width="180px">
					<template slot-scope="scope">
						<el-button type="text" size="mini" @click="standarLine(scope.$index, scope.row)">详情</el-button>
						<el-button type="text" size="mini" @click="edit(scope.$index, scope.row)"
            :disabled = "scope.row.status != 1 || !scope.row.doUse">设置默认</el-button>
					</template>
				</el-table-column>
			</el-table>
			<div class="block changepages">
			  <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="readQuery.page" :page-sizes="[5,20,30,40]" :page-size="readQuery.pageCount" layout="total, sizes, prev, pager, next, jumper" :total="rowNumber">
			  </el-pagination>
			</div>
			<!--弹窗-->
			<div v-if="detailShow">
				<div class="popupMask">
					<div class="popupPenal">
						<div class="popPenalTitle">
							<div class="popPenalTitleName">
								查看曲线详情
							</div>
						</div>
						<div class="penalContent">
							<el-table :data="detailData" style="width: 100%" :height="tabDivHeight" size="mini">
								<el-table-column label="序号" min-width="50px">
									<template slot-scope="scope">
										{{scope.$index+1}}
									</template>
								</el-table-column>
								<el-table-column property="name" label="名称" min-width="100px">
								</el-table-column>
								<el-table-column property="testBatch" label="测试批" min-width="100px">
								</el-table-column>
								<el-table-column property="detectabilityName" label="能力参数名称" min-width="100px">
								</el-table-column>
								<el-table-column property="createTime" label="曲线生产日期" min-width="100px">
								</el-table-column>
								<el-table-column property="slope" label="斜率" min-width="50px">
								</el-table-column>
								<el-table-column property="deviation" label="偏移" min-width="50px">
								</el-table-column>
								<el-table-column property="doDefaultUse" label="是否默认" min-width="100px">
									<template slot-scope="scope">
										<p v-if="scope.row.doDefaultUse">是</p>
										<p v-else>否</p>
									</template>
								</el-table-column>
								<el-table-column property="remark" label="偏移" min-width="100px">
								</el-table-column>
							</el-table>
						</div>
						<div class="penalFooter">
							<el-button class="penalButton" size="mini" @click="detailShow = false">关闭</el-button>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!--:testpanelDetail="testpanelData"
            :userData="userData" :allUnit="allUnit" :standarModel="standarModel" :signalObj="signalObj"-->
		<standar-series :addVisible.sync="standardseriesshow" :newOrEdit="newOrEdit" :standarModel="standarModel" :standardSeriesDetail="standardSeriesForm"></standar-series>
	</div>
</template>

<script>
	import { mapState } from 'vuex'
	const standarSeries = () => import('./standarSeries.vue');
	export default {
		props: {
			calibrationData: Object
		},
		data() {
			return {
				page: 1,
				tableHeightD: ((window.innerHeight - 300) / 3 - 25),
				demand: {
					id: '',
					detectability: '',
					startDate: '',
					endDate: '',
					status: '',
				},
				standardSeriesForm: {
					code: '',
					configDate: null,
					temperature: '',
					humcodeity: '',
					doUse: false,
					checker: '',
					configMan: JSON.parse(sessionStorage.getItem('laboratoryAccountInfo')).loginid,
				},
				StandardCuRecordList: [],
				detectabilityData: [],
				detailShow: false,
				detailData: [],
				//校准曲线
				batchcreatetimestart: '',

				datapickereditable: false,
				standardseriesshow: false,
				standarModel: "equipment", //仪器的标准系列弹框
				newOrEdit: "edit",
				//截止日期可选范围
				pickerenddatefanwei: {
					disabledDate: function (time) {
						//	            let timeSpace = time.getTime() < new Date((this.batchcreatetimestart?this.batchcreatetimestart:'1970-01-01')).getTime();
						//	            return timeSpace;
					}
				},
        readQuery:{
          page:1,
          pageCount:20
        },
        rowNumber:0,
			}
		},
		//
		components: {
			standarSeries
		},
		computed: {
			...mapState(['enableStatus']),
			tabDivHeight() {
				return (window.innerHeight - 460)
			}
		},
    watch:{
      readQuery: {
        handler(val, oldVal) {
          this.init()
        },
        deep: true
      },
    },

		mounted() {
			this.demand.id = this.calibrationData.id
			this.detectabilityInit()
			this.init()
		},
		methods: {
			empty() {
				this.demand.detectability = '';
				this.demand.startDate = '';
				this.demand.endDate = '';
				this.demand.status = '';
        this.readQuery.page = 1;
				this.init()
			},
			formatterStatus(row, column, cellValue){
				return this.util.changeStatus({ cellValue: cellValue, list: this.enableStatus })
			},
			init() {
        this.demand.page = this.readQuery.page;
        this.demand.pageCount = this.readQuery.pageCount;
				this.$http({
					apiUrl: 'resource/readCritsByEquip.htm',
					method: 'get',
					params: this.demand,
				}).then(res => {
					if (res.code === 0) {
						this.StandardCuRecordList = res.data
            if (!res.pageinfo) {
              this.rowNumber = 0;
            } else if (res.pageinfo && !res.pageinfo.rowNumber) {
              this.rowNumber = 0;
            } else {
              this.rowNumber = res.pageinfo.rowNumber;
            }
					}
				})
			},
			detectabilityInit() {
				this.$http({
					apiUrl: 'resource/readDetectabilityComboList.htm',
					method: 'post',
					params: {equipment:this.calibrationData.id},
          isJson:false
				}).then(res => {
					if (res.code == 0) {
						this.detectabilityData = res.data
					}
				})
			},
			// 标准曲线,查看最新
			standarLine(index, row) {

				this.$http({
					method: 'post',
					apiUrl: '/detection/readCriterion.htm',
					params: { batch: row.batch },
					isJson: false,
				}).then(res => {
					if (res.code === 0) {
						if(res.data == undefined){
							this.$notify({
								message:"本批次未应用标准曲线！",
								title:"警告",
								type:"warning"
							});
							return;
						}
						this.standardSeriesForm = res.data;
						this.standardseriesshow = true;

					}
				})
			},
			edit(index, row) {
				this.$confirm('是否设置默认曲线', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.$http({
						apiUrl: 'resource/setDefaultCurve.htm',
						method: 'post',
						params: { id: row.id, equipment: this.calibrationData.id },
						isJson: false
					}).then(res => {
						if (res.code === 0) {
							this.init()
						}
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消设置'
					});
				});
			},
			handleSizeChange: function(val) {
			  this.readQuery.pageCount = val;
			},
			handleCurrentChange: function(val) {
			  this.readQuery.page = val;
			},
		}
	}

</script>

<style scoped>
	.penalContent {
		padding: 10px
	}
</style>
